@media screen and (min-width: 700px) {
h1 {
  font-size: 1.5em;
 }

 h2 {
  font-size: 1.4em;
 }

 p{font-size: 1.9em;}

   /*-----------Boton flotante */
   .flotante {
    bottom: 190px;
    right: 20px;
   }
  

 .triangulo_trans {
  /* triangulo trasparente */
  width: 350px;
  height: 450px;
  top: -580px;
  left: -260px;
 }

 .triangulo_azul {
  width: 350px;
  height: 450px;
  top: 40px;
  left: -50px;
 }


 /* TRIANGULO 1*/
 .slider1 {
  max-width: 250px;
  max-height: 250px;
  right: 20px;
  top: 420px;
 }

 .slider1 .imagen {
  width: 250px;
  height: 250px;
 }

 /*triangulo 2 */
 .slider2 {
  max-width: 100px;
  max-height: 100px;
  right: 420px;
  top: 460px;
 }

 .slider2 .imagen {
  width: 100px;
  height: 100px;
 }

 /* TRIANGULO 3*/

 .slider3 {
  max-width: 100px;
  max-height: 100px;
  right: 320px;
  top: 560px;
 }

 .slider3 .imagen {
  width: 100px;
  height: 100px;
 }

 /* TRIANGULO 4*/
 .slider4 {
  max-width: 100px;
  max-height: 100px;
  right: 220px;
  top: 660px;
 }

 .slider4 .imagen {
  width: 100px;
  height: 100px;
 }

 /* Footer*/
 footer {
  top: 240px;
  font-size: 19px;
 }

 .info {
  margin-bottom: 5px;
 }

 footer .pie {
  flex-direction: column;

 }

 /* hexagano*/
 .hexagono {
  width: 150px;
  height: 200px;
  top: 710px;
  left: 100px;
 }
 .hexagono img{
  left: -35px;
 }

 .hexagono2 {
  width: 150px;
  height: 200px;
  top: 440px;
  left: 230px;
 }
 .hexagono2 img{
  left: -35px;
 }

 .hexagono4 {
  width: 150px;
  height: 200px;
  top: 160px;
  left: 100px;
 }

 /* Letras en movimiento */
 .letras {
  top: -340px;
  left: -180px;
 }
/* flechas----------*/

.triangulo i {
  top: 42%;
 
 }
.triangulo i:first-child {
  left: 120px;
 }

 .triangulo i:last-child {
  left: 400px;
 }

  /* Logo---------------------------  */   

  .logoE {
    max-width: 500px;
    max-height: 400px;
    
    left: 100px;
   bottom: 1420px;
   }
  
   .logoE .imagen {
    width: 200px;
    height: 100px;
    
   }
     
          /* Estilos de la lista */
          .zegundo {
           font-size: 9px;
           height: 40px;
          }
     
     
          /* Ajustar los párrafos al div y ocultar el exceso de texto */
          .zegundo p {
           margin: 0;
           padding: 0;
           max-height: 100%;
           overflow: hidden;
          }
     
          /*    boton de mas informacion*/
     
          button {
     
           border-radius: 20px;
           top: -740px;
           left: 450px;
           font-size: 15px;
           /* Corrección del padding */
           padding: 10px 20px;
          }
     
     
     
          /* Estilos para el contenedor principal */
          .contenido {
           top: -350px;
           text-align: center;
           margin-bottom: 40px;
          }
     
          /* Estilos para el título */
          .titulo {
           font-size: 19px;
          }
     
          /* Estilos para los subtítulos */
          .subtitulos {
           height: 24px;
           /* Altura fija para que se muestre solo un subtitulo a la vez */
           overflow: hidden;
     
          }
     
          .subtitulo {
           font-size: 22px;
           font-weight: bold;
           margin: 0;
           padding: 0;
          }
     
          /* Estilos para las imágenes */
          .imagenes-container {
           display: flex;
           justify-content: center;
           /* Alinea las imágenes al inicio */
           max-width: 750px;
           /* Ancho total de las imágenes */
           margin: 0 auto;
           /* Centra el contenedor horizontalmente */
          }
     
          .imagen {
           width: 200px;
           height: 200px;
           object-fit: contain;
          }
}
 /* -----------------------------------------------------------------Media---------------------------*/  
@media screen and (min-width: 800px) {
  h1 {
    font-size: 2.0em;
   }
  
   h2 {
    font-size: 1.30em;
   }
  
   p{font-size: 2.5em;}

   
  
   /*-----------Boton flotante */
   .flotante {
    bottom: 190px;
   }
  
   header .container {
    flex-direction: row;
    justify-content: space-around;
    padding-left: 25px;
    font-size: 12px;
   }

  
   .triangulo_trans {
    /* triangulo trasparente */
    width: 350px;
    height: 450px;
    top: -640px;
    left: -260px;
   }
  
   .triangulo_azul {
    width: 350px;
    height: 450px;
    top: 40px;
    left: -50px;
   }

   /* flechas----------*/

.triangulo i {
  top: 39%;
 
 }
.triangulo i:first-child {
  left: 130px;
 }

 .triangulo i:last-child {
  left: 450px;
 }

  
   /* Logo---------------------------*/         

   .logoE {
    max-width: 600px;
    max-height: 500px;
    left: 100px;
    bottom: 1450px;
   }
  
   .logoE .imagen {
    width: 200px;
    height: 100px;
   }
  
   /* TRIANGULO 1*/
   .slider1 {
    max-width: 290px;
    max-height: 290px;
    right: 30px;
    top: 400px;
   }
  
   .slider1 .imagen {
    width: 290px;
    height: 290px;
   }
  
   /*triangulo 2 */
   .slider2 {
    max-width: 120px;
    max-height: 120px;
    right: 460px;
    top: 480px;
   }
  
   .slider2 .imagen {
    width: 120px;
    height: 120px;
   }
  
   /* TRIANGULO 3*/
  
   .slider3 {
    max-width: 120px;
    max-height: 120px;
    right: 350px;
    top: 590px;
   }
  
   .slider3 .imagen {
    width: 120px;
    height: 120px;
   }
  
   /* TRIANGULO 4*/
   .slider4 {
    max-width: 120px;
    max-height: 120px;
    right: 240px;
    top: 700px;
   }
  
   .slider4 .imagen {
    width: 120px;
    height: 120px;
   }
  
   /* Footer*/
   footer {
    top: 280px;
    font-size: 18px;
   }
  
   .info {
    margin-bottom: 10px;
   }
  
   footer .pie {
    flex-direction: row;
  
   }
  
   /* hexagano*/
   .hexagono {
    width: 170px;
    height: 220px;
    top: 740px;
    left: 90px;
   }
  .hexagono img{
    left:-40px;
  }
   .hexagono2 {
    width: 170px;
    height: 220px;
    top: 440px;
    left: 250px;
   }
   .hexagono2 img{
    left:-40px;
  }
   .hexagono4 {
    width: 170px;
    height: 220px;
    top: 140px;
    left: 90px;
   }
   .hexagono4 img{
    left:-40px;
  }
   /* Boton info*/
   button {
     
    border-radius: 20px;
    top: -750px;
    left: 580px;
    font-size: 15px;
    /* Corrección del padding */
    padding: 10px 20px;
   }
  
   /* Letras en movimiento */
   .letras {
    top: -390px;
    left: -200px;
   }

    /* Estilos de la lista */
          .zegundo {
           font-size: 8px;
           height: 50px;
          }
  
   /* Estilos para el contenedor principal */
   .contenido {
    top: -350px;
    text-align: center;
    margin-bottom: 22px;
    left: 30px;
   }

   /* Estilos para el título */
   .titulo {
    font-size: 20px;
    margin-left: 250px;
   }

   /* Estilos para los subtítulos */
   .subtitulos {
    height: 25px;
    /* Altura fija para que se muestre solo un subtitulo a la vez */
    overflow: hidden;

   }

   .subtitulo {
    font-size: 22px;
    font-weight: bold;
    margin: 0;
    padding: 0;
   }

   /* Estilos para las imágenes */
   .imagenes-container {
    display: flex;
    justify-content: center;
    /* Alinea las imágenes al inicio */
    max-width: 850px;
    /* Ancho total de las imágenes */
    margin: 0 auto;
    /* Centra el contenedor horizontalmente */
   }

   .imagen {
    width: 230px;
    height: 240px;
    object-fit: contain;
   }

    /* Carrusel de noticias */
    .carrusel {
      top: -350px;
      width: 50%;
      height: 50%;
  }
  }
  /*------------------------------- Medida--------------------------------------------------------------------------------------------- */

@media screen and (min-width: 900px) {
 h1 {
   font-size: 1.8em;
  }
 
  h2 {
   font-size: 1.20em;
  }
      .develop > a {
         
          font-size: 20px; /* Tamaño de letra más grande */
      }
      
      .develop > a::after {
         
          height: 6px; /* Línea más gruesa */
         
      }
 
  /*-----------Boton flotante */
   .flotante {
    bottom: 190px;
   }
 
  header .container {
   flex-direction: row;
   justify-content: space-around;
   padding-left: 25px;
   font-size: 12px;
  }
 
  .triangulo_trans {
   /* triangulo trasparente */
   width: 350px;
   height: 450px;
   top: -670px;
   left: -260px;
  }
 
  .triangulo_azul {
   width: 350px;
   height: 450px;
   top: 40px;
   left: -50px;
  }
    /* flechas----------*/

.triangulo i {
  top: 37%;
 
 }
.triangulo i:first-child {
  left: 200px;
 }

 .triangulo i:last-child {
  left: 500px;
 }
  .logoE {
    max-width: 480px;
    max-height: 210px;
    left: 240px;
    bottom: 1485px;
   }
  
   .logoE .imagen {
    width: 200px;
    height: 100px;
   }
 
  /* TRIANGULO 1*/
  .slider1 {
   max-width: 290px;
   max-height: 290px;
   right: 80px;
   top: 380px;
  }
 
  .slider1 .imagen {
   width: 290px;
   height: 290px;
  }
 
  /*triangulo 2 */
  .slider2 {
   max-width: 130px;
   max-height: 130px;
   right: 520px;
   top: 450px;
  }
 
  .slider2 .imagen {
   width: 130px;
   height: 130px;
  }
 
  /* TRIANGULO 3*/
 
  .slider3 {
   max-width: 130px;
   max-height: 130px;
   right: 400px;
   top: 570px;
  }
 
  .slider3 .imagen {
   width: 130px;
   height: 130px;
  }
 
  /* TRIANGULO 4*/
  .slider4 {
   max-width: 130px;
   max-height: 130px;
   right: 280px;
   top: 690px;
  }
 
  .slider4 .imagen {
   width: 130px;
   height: 130px;
  }
 
  /* Footer*/
  footer {
   top: 280px;
   font-size: 20px;
  }
 
  .info {
   margin-bottom: 10px;
  }
 
  footer .pie {
   flex-direction: row;
  }
 
  /* hexagano*/
  .hexagono {
   width: 180px;
   height: 230px;
   top: 720px;
   left: 125px;
  }
 
  .hexagono2 {
   width: 180px;
   height: 230px;
   top: 410px;
   left: 280px;
  }
 
  .hexagono4 {
   width: 180px;
   height: 230px;
   top: 90px;
   left: 125px;
  }
 
  /* Boton info*/
  button {
     
    border-radius: 20px;
    top: -800px;
    left: 680px;
    font-size: 15px;
    /* Corrección del padding */
    padding: 10px 20px;
   }
 
  /* Letras en movimiento */
  .letras {
   top: -450px;
   left: -170px;
  }
   /* Estilos para el contenedor principal */
   .contenido {
    top: -400px;
    text-align: center;
    margin-bottom: 20px;
   }

   /* Estilos para el título */
   .titulo {
    font-size: 20px;
    margin-left: 300px;
   }
   /* Estilos para los subtítulos */
   .subtitulos {
    height: 26px;
    /* Altura fija para que se muestre solo un subtitulo a la vez */
    overflow: hidden;

   }

   .subtitulo {
    font-size: 23px;
    font-weight: bold;
    margin: 0;
    padding: 0;
   }

   /* Estilos para las imágenes */
   .imagenes-container {
    display: flex;
    justify-content: center;
    /* Alinea las imágenes al inicio */
    max-width: 850px;
    /* Ancho total de las imágenes */
    margin: 0 auto;
    /* Centra el contenedor horizontalmente */
   }

   .imagen {
    width: 260px;
    height: 260px;
    object-fit: contain;
   }

    /* Carrusel de noticias */
    .carrusel {
      top: -410px;
      width: 45%;
  }
}
/* medida--------------------------------------------------------------------------------*/
@media screen and (min-width: 1000px) {
  h1 {
    font-size: 1.8em;
   }
  
   h2 {
    font-size: 1.30em;
   }
  
     /*-----------Boton flotante */
     .flotante {
      bottom: 190px;
      right: 10px;
     }
   /*------- Header ---------- */
   header .container {
    flex-direction: row;
    justify-content: space-around;
    padding-left: 25px;
    font-size: 12px;
   }
  
   header nav {
    flex-direction: row;
    padding-bottom: 10;
    padding-right: 10px;
   }
  
   li {
    list-style: none;
    padding: 10px;
    transition: all 0.5s ease 0s;
   }


  
   .container nav ul li:hover .submenu {
    flex-wrap: nowrap;
   }

/* Estilos por defecto para pantallas grandes */
.container nav ul li .submenu .sub-menu:not(:last-child) {
 border-right: 5px solid white; /* Solo línea vertical */
 padding-right: 15px;
 margin-right: 15px;
 border-bottom: none; /* Asegúrate de no tener línea horizontal aquí */
}

.container nav ul li .submenu .sub-menu {
 width: calc(33.3% - 30px);
 display: inline-block;
 /* Otros estilos que ya tienes */
}

   .container nav ul li .submenu{

    top: 100%; /* Posicionamos el submenú debajo del botón */
  left: -60%; /* Alineamos el submenú con el botón */
  /* Aliniamos el texto a la izquierda */
 }
  
 .container nav ul li.develop:nth-child(1) .submenu {
  margin-left: -300px; /* Desplaza solo el submenú de 'Soluciones' */
  /* Otros estilos */
}

   .container nav ul li:hover .submenu {
    flex-wrap: nowrap;
   }
  
   /* Flechas de los slider */
   .triangulo i {
    top: 40%;
    height: 55px;
    width: 55px;
    line-height: 55px;
   }
  
   .triangulo i:first-child {
    left: 260px;
   }
  
   .triangulo i:last-child {
    left: 600px;
   }
  
   /* triangulo trasparente */
   .triangulo_trans {
    width: 400px;
    height: 500px;
    top: -630px;
    left: -230px;
   }
  
   .triangulo_azul {
    width: 400px;
    height: 500px;
    top: 40px;
    left: -50px;
   }
  
   /*-------LOGO EMPRESARIAL-------- */
  

   .logoE {
    max-width: 730px;
    max-height: 530px;
    left: 150px;
    bottom: 1650px;
   }
  
   .logoE .imagen {
    width: 200px;
    height: 100px;
   }
  
   /* TRIANGULO 1*/
   .slider1 {
    max-width: 300px;
    max-height: 300px;
    right: 70px;
    top: 400px;
   }
  
   .slider1 .imagen {
    width: 300px;
    height: 300px;
   }
  
   /*triangulo 2 */
   .slider2 {
    max-width: 150px;
    max-height: 150px;
    right: 540px;
    top: 470px;
   }
  
   .slider2 .imagen {
    width: 150px;
    height: 150px;
   }
  
   /* TRIANGULO 3*/
  
   .slider3 {
    max-width: 150px;
    max-height: 150px;
    right: 410px;
    top: 600px;
   }
  
   .slider3 .imagen {
    width: 150px;
    height: 150px;
   }
  
   /* TRIANGULO 4*/
   .slider4 {
    max-width: 150px;
    max-height: 150px;
    right: 280px;
    top: 730px;
   }
  
   .slider4 .imagen {
    width: 150px;
    height: 150px;
   }
  
   /* Footer*/
   footer {
    top: 350px;
    font-size: 20px;
   }
  
   .info {
    margin-bottom: 25px;
   }
  
   footer .pie {
    flex-direction: row;
   }

   /* hexagano*/
   .hexagono {
    width: 200px;
    height: 250px;
    top: 820px;
    left: 210px;
   }
   .hexagono img{
    left: -45px;
   }
  
   .hexagono2 {
    width: 200px;
    height: 250px;
    top: 480px;
    left: 370px;
   }

   .hexagono2 img{
    left: -45px;
   }
  
   .hexagono4 {
    width: 200px;
    height: 250px;
    top: 130px;
    left: 210px;
   }
   .hexagono4 img{
    left: -45px;
   }
  
   /* Letras en movimiento */
   .letras {
    top: -480px;
    left: -200px;
   }
  
   .letras ul {
    padding-left: 10px;
   }

     /* Boton info*/
  button {
     
    border-radius: 20px;
    top: -900px;
    left: 790px;
    font-size: 15px;
    /* Corrección del padding */
    padding: 10px 20px;
   }
 
   /* Estilos para el contenedor principal */
   .contenido {
    flex-direction: column; /* Cambiamos la dirección del contenedor a columna para apilar los elementos */
    align-items: center; /* Centramos los elementos horizontalmente */
    top: -460px; /* Eliminamos el desplazamiento negativo para que el contenido se muestre en su posición normal */
    left: 500px;
    margin-bottom: 40px;
    max-width: 320px;
    max-height: auto;
  }

  .titulo {
    font-size: 23px;
    margin-left: -350px; /* Quitamos el margen izquierdo */
    margin-bottom: -25px; /* Agregamos un margen inferior para separar el título de los subtítulos */
  }

  .subtitulos {
    height: auto; /* Quitamos la altura fija para que los subtítulos ocupen el espacio necesario */
    overflow: visible; /* Eliminamos el ocultamiento de los subtítulos */
    text-align: center; /* Centramos los subtítulos horizontalmente */
  }

  .subtitulo {
    font-size: 20px; /* Ajustamos el tamaño de los subtítulos */
    position: static; /* Cambiamos la posición a estática para que aparezcan debajo del título */
    width: 100%; /* Aseguramos que ocupen el ancho completo del contenedor */
    margin: 0px 0;
    margin-left: 60px; /* Agregamos margen superior e inferior para separar los subtítulos */
  }

  .imagenes-container {
    max-width: 100%; /* Permitimos que las imágenes ocupen el ancho completo del contenedor */
    margin: 20px 0; /* Agregamos margen superior e inferior para separar las imágenes del título y subtítulos */
  }

  .imagen {
    width: 200px; /* Ajustamos el tamaño de las imágenes para que sean más grandes */
    height: 200px;
    object-fit: contain;
  }

   /* Carrusel de noticias */
   .carrusel {
    top: -480px;
}
}

  /*-------Medida----------------------------------------------------------------------------------------------------------------------- */

@media screen and (min-width: 1200px) {

  .header .container {
    flex-direction: row;
    justify-content: space-around;
    padding-left: 25px;
    font-size: 16px;
   }

   h1{
    font-size: 1.7em;
   }
   h2{
    font-size: 1.4em;
   }
 /* Boton flotante*/  
  .flotante {
  position: fixed;
  bottom: 180px;
  right: 10px;
 }


 .container nav ul li.develop:nth-child(1) .submenu {
  margin-left: -250px; /* Desplaza solo el submenú de 'Soluciones' */
  /* Otros estilos */
}
/*-------LOGO EMPRESARIAL-------- */
  
.logoE {
  max-width: 450px;
  max-height: 200px;
  left: 75px;
  bottom: 1590px;
 }

 .logoE .imagen {
  width: 180px;
  height: 90px;
 }
  

  /* Carrusel de noticias */
  .carrusel {
    top: -890px;
    right: 180px;
}
   /* Flechas de los slider */
   .triangulo i {
    top: 18%;
    height: 45px;
    width: 45px;
    line-height: 45px;
   }
  
   .triangulo i:first-child {
    left: 600px;
   }
  
   .triangulo i:last-child {
    left: 860px;
   }
    /* triangulo trasparente */
         .triangulo_trans {
          width: 340px;
          height: 460px;
          top: -610px;
          left: -230px;
         }
        
         .triangulo_azul {
          width: 340px;
          height: 460px;
          top: 40px;
          left: -50px;
         }
  
   /* TRIANGULO 1*/
   .slider1 {
    max-width: 280px;
    max-height: 280px;
    right: 10px;
    top: 170px;
   }
  
   .slider1 .imagen {
    width: 280px;
    height: 280px;
   }
  
   /*triangulo 2 */
   .slider2 {
    max-width: 120px;
    max-height: 120px;
    right: 410px;
    top: 250px;
   }
  
   .slider2 .imagen {
    width: 120px;
    height: 120px;
   }
  
   /* TRIANGULO 3*/
  
   .slider3 {
    max-width: 120px;
    max-height: 120px;
    right: 300px;
    top: 360px;
   }
  
   .slider3 .imagen {
    width: 120px;
    height: 120px;
   }
  
   /* TRIANGULO 4*/
   .slider4 {
    max-width: 120px;
    max-height: 120px;
    right: 190px;
    top: 470px;
   }
  
   .slider4 .imagen {
    width: 120px;
    height: 120px;
   }
  
   /* Footer*/
   footer {
    top: 0px;
    font-size: 21px;
   }
  
   .info {
    margin-bottom: 15px;
   }
  
   footer .pie {
    flex-direction: row;
   }
  
   /* hexagano*/
   .hexagono {
    width: 180px;
    height: 230px;
    top: 600px;
    left: 990px;
   }
  
   .hexagono2 {
    width: 180px;
    height: 230px;
    top: 470px;
    left: 840px;
   }
  
   .hexagono4 {
    width: 180px;
    height: 230px;
    top: 40px;
    left: 1130px;
   }
  
   /* Letras en movimiento */
   .letras {
    left: 20px;
    top: -630px;
   }
  
     /* Boton info*/
  button {
     
    border-radius: 20px;
    top: -850px;
    left: 310px;
    font-size: 15px;
    /* Corrección del padding */
    padding: 10px 20px;
   }
 
   .contenido {
    flex-direction: column; /* Cambiamos la dirección del contenedor a columna para apilar los elementos */
    align-items: center; /* Centramos los elementos horizontalmente */
    top: -880px; /* Eliminamos el desplazamiento negativo para que el contenido se muestre en su posición normal */
    left: 300px;
    margin-bottom: 40px;
    max-width: 320px;
    max-height: auto;
  }

  .titulo {
    font-size: 23px;
    margin-left: -500px; /* Quitamos el margen izquierdo */
    margin-bottom: -25px; /* Agregamos un margen inferior para separar el título de los subtítulos */
  }

  .subtitulos {
    height: auto; /* Quitamos la altura fija para que los subtítulos ocupen el espacio necesario */
    overflow: visible; /* Eliminamos el ocultamiento de los subtítulos */
    text-align: center; /* Centramos los subtítulos horizontalmente */
  }

  .subtitulo {
    font-size: 20px; /* Ajustamos el tamaño de los subtítulos */
    position: static; /* Cambiamos la posición a estática para que aparezcan debajo del título */
    width: 100%; /* Aseguramos que ocupen el ancho completo del contenedor */
    margin: 0px 0;
    margin-left: 60px; /* Agregamos margen superior e inferior para separar los subtítulos */
  }

  .imagenes-container {
    max-width: 100%; /* Permitimos que las imágenes ocupen el ancho completo del contenedor */
    margin: 20px 0; /* Agregamos margen superior e inferior para separar las imágenes del título y subtítulos */
  }

  .imagen {
    width: 180px; /* Ajustamos el tamaño de las imágenes para que sean más grandes */
    height: 180px;
    object-fit: contain;
  }

}

      /*------------------------------------ Medida --------------------------------------------------------------------- */
      @media screen and (min-width: 1400px) {
        h1 {
          font-size: 1.6em;
         }
        
         h2 {
          font-size: 1.50em;
         }

      
        
         /*-----------Boton flotante */
         .flotante {
          bottom: 100px;
         
         }

         .container nav ul li.develop:nth-child(1) .submenu {
          margin-left: -180px; /* Desplaza solo el submenú de 'Soluciones' */
          /* Otros estilos */
      }
     
        
         /*------- Header ---------- */
         header .container {
          flex-direction: row;
          justify-content: space-around;
          padding-left: 27px;
          font-size: 14px;
         }
        
         header nav {
          flex-direction: row;
          padding-bottom: 0;
          padding-right: 22px;
         }
        
         li {
          list-style: none;
          padding: 20px;
          transition: all 0.5s ease 0s;
         }

         .container nav ul li a span {
          font-size: 30px;
          bottom: -5px;
          
         }
        
         .container nav ul li:hover .submenu {
          flex-wrap: nowrap;
         }
        
         /* Flechas de los slider */
         .triangulo i {
          top: 14%;
          height: 55px;
          width: 55px;
          line-height: 55px;
         }
        
         .triangulo i:first-child {
          left: 750px;
         }
        
         .triangulo i:last-child {
          left: 1150px;
         }
        
         /* triangulo trasparente */
         .triangulo_trans {
          width: 380px;
          height: 500px;
          top: -530px;
          left: -230px;
         }
        
         .triangulo_azul {
          width: 380px;
          height: 500px;
          top: 40px;
          left: -50px;
         }
        
         /*-------LOGO EMPRESARIAL-------- */
        
         .logoE {
          max-width: 500px;
          max-height: 280px;
          left: 180px;
          bottom: 1600px;
         }
        
         .logoE .imagen {
          width: 200px;
          height: 120px;
         }
        
         /* TRIANGULO 1*/
         .slider1 {
          max-width: 285px;
          max-height: 285px;
          right: 20px;
          top: 170px;
         }
        
         .slider1 .imagen {
          width: 285px;
          height: 285px;
         }
        
         /*triangulo 2 */
         .slider2 {
          max-width: 130px;
          max-height: 130px;
          right: 450px;
          top: 230px;
         }
        
         .slider2 .imagen {
          width: 130px;
          height: 130px;
         }
        
         /* TRIANGULO 3*/
        
         .slider3 {
          max-width: 130px;
          max-height: 130px;
          right: 330px;
          top: 350px;
         }
        
         .slider3 .imagen {
          width: 130px;
          height: 130px;
         }
        
         /* TRIANGULO 4*/
         .slider4 {
          max-width: 130px;
          max-height: 130px;
          right: 210px;
          top: 470px;
         }
        
         .slider4 .imagen {
          width: 130px;
          height: 130px;
         }
        
         /* Footer*/
         footer {
          top: 0px;
          font-size: 22px;
         }
        
         .info {
          margin-bottom: 1px;
         }
        
         footer .pie {
          flex-direction: row;
         }
        
        
         /* hexagano*/
         .hexagono {
          width: 160px;
          height: 210px;
          top: 710px;
          left: 1050px;
         }
        
         .hexagono2 {
          width: 160px;
          height: 210px;
          top: 420px;
          left: 1180px;
         }
        
         .hexagono4 {
          width: 160px;
          height: 210px;
          top: 130px;
          left: 1320px;
         }
        
        
         /* Letras en movimiento */
         .letras {
        
          top: -610px;
          left: 150px;
         }
        
         .letras ul {
          padding-left: 8px;
         }

             /* Estilos de la lista */
      .zegundo {
        font-size: 10px;
        height: 40px;
       }
/* Boton info*/
  button {
     
    border-radius: 20px;
    top: -1020px;
    left: 890px;
    font-size: 15px;
    /* Corrección del padding */
    padding: 10px 20px;
   }
 
   .contenido {
    flex-direction: column; /* Cambiamos la dirección del contenedor a columna para apilar los elementos */
    align-items: center; /* Centramos los elementos horizontalmente */
    top: -860px; /* Eliminamos el desplazamiento negativo para que el contenido se muestre en su posición normal */
    left: 380px;
    margin-bottom: 40px;
    max-width: 320px;
    max-height: auto;
  }

  .titulo {
    font-size: 23px;
    margin-left: -380px; /* Quitamos el margen izquierdo */
    margin-bottom: -25px; /* Agregamos un margen inferior para separar el título de los subtítulos */
  }

  .subtitulos {
    height: auto; /* Quitamos la altura fija para que los subtítulos ocupen el espacio necesario */
    overflow: visible; /* Eliminamos el ocultamiento de los subtítulos */
    text-align: center; /* Centramos los subtítulos horizontalmente */
  }

  .subtitulo {
    font-size: 20px; /* Ajustamos el tamaño de los subtítulos */
    position: static; /* Cambiamos la posición a estática para que aparezcan debajo del título */
    width: 100%; /* Aseguramos que ocupen el ancho completo del contenedor */
    margin: 0px 0;
    margin-left: 70px; /* Agregamos margen superior e inferior para separar los subtítulos */
  }

  .imagenes-container {
    max-width: 100%; /* Permitimos que las imágenes ocupen el ancho completo del contenedor */
    margin: 20px 0; /* Agregamos margen superior e inferior para separar las imágenes del título y subtítulos */
  }

  .imagen {
    width: 210px; /* Ajustamos el tamaño de las imágenes para que sean más grandes */
    height: 210px;
    object-fit: contain;
  }
}

 /*------------------------------------ Medida --------------------------------------------------------------------- */
 @media screen and (min-width: 1500px) {
  h1 {
    font-size: 1.6em;
   }
  
   h2 {
    font-size: 1.50em;
   }


  
   /*-----------Boton flotante */
   .flotante {
    bottom: 100px;
   
   }

   .container nav ul li.develop:nth-child(1) .submenu {
    margin-left: -180px; /* Desplaza solo el submenú de 'Soluciones' */
    /* Otros estilos */
}

  
   /*------- Header ---------- */
   header .container {
    flex-direction: row;
    justify-content: space-around;
    padding-left: 27px;
    font-size: 14px;
   }
  
   header nav {
    flex-direction: row;
    padding-bottom: 0;
    padding-right: 22px;
   }
  
   li {
    list-style: none;
    padding: 20px;
    transition: all 0.5s ease 0s;
   }

   .container nav ul li a span {
    font-size: 30px;
    bottom: -5px;
    
   }
  
   .container nav ul li:hover .submenu {
    flex-wrap: nowrap;
   }
  
   /* Flechas de los slider */
   .triangulo i {
    top: 14%;
    height: 55px;
    width: 55px;
    line-height: 55px;
   }
  
   .triangulo i:first-child {
    left: 750px;
   }
  
   .triangulo i:last-child {
    left: 1150px;
   }
  
   /* triangulo trasparente */
   .triangulo_trans {
    width: 380px;
    height: 500px;
    top: -530px;
    left: -230px;
   }
  
   .triangulo_azul {
    width: 380px;
    height: 500px;
    top: 40px;
    left: -50px;
   }
  
   /*-------LOGO EMPRESARIAL-------- */
  
   .logoE {
    max-width: 500px;
    max-height: 280px;
    left: 180px;
    bottom: 1560px;
   }
  
   .logoE .imagen {
    width: 200px;
    height: 120px;
   }
  
   /* TRIANGULO 1*/
   .slider1 {
    max-width: 285px;
    max-height: 285px;
    right: 20px;
    top: 170px;
   }
  
   .slider1 .imagen {
    width: 285px;
    height: 285px;
   }
  
   /*triangulo 2 */
   .slider2 {
    max-width: 130px;
    max-height: 130px;
    right: 450px;
    top: 230px;
   }
  
   .slider2 .imagen {
    width: 130px;
    height: 130px;
   }
  
   /* TRIANGULO 3*/
  
   .slider3 {
    max-width: 130px;
    max-height: 130px;
    right: 330px;
    top: 350px;
   }
  
   .slider3 .imagen {
    width: 130px;
    height: 130px;
   }
  
   /* TRIANGULO 4*/
   .slider4 {
    max-width: 130px;
    max-height: 130px;
    right: 210px;
    top: 470px;
   }
  
   .slider4 .imagen {
    width: 130px;
    height: 130px;
   }
  
   /* Footer*/
   footer {
    top: 0px;
    font-size: 22px;
   }
  
   .info {
    margin-bottom: 1px;
   }
  
   footer .pie {
    flex-direction: row;
   }
  
  
   /* hexagano*/
   .hexagono {
    width: 160px;
    height: 210px;
    top: 710px;
    left: 1150px;
   }
  
   .hexagono2 {
    width: 160px;
    height: 210px;
    top: 420px;
    left: 1300px;
   }
  
   .hexagono4 {
    width: 160px;
    height: 210px;
    top: 130px;
    left: 1450px;
   }
  
  
   /* Letras en movimiento */
   .letras {
  
    top: -610px;
    left: 80px;
   }
  
   .letras ul {
    padding-left: 8px;
   }

       /* Estilos de la lista */
.zegundo {
  font-size: 10px;
  height: 40px;
 }
/* Boton info*/
button {

border-radius: 20px;
top: -830px;
left: 400px;
font-size: 15px;
/* Corrección del padding */
padding: 10px 20px;
}

.contenido {
flex-direction: column; /* Cambiamos la dirección del contenedor a columna para apilar los elementos */
align-items: center; /* Centramos los elementos horizontalmente */
top: -860px; /* Eliminamos el desplazamiento negativo para que el contenido se muestre en su posición normal */
left: 380px;
margin-bottom: 40px;
max-width: 320px;
max-height: auto;
}

.titulo {
font-size: 23px;
margin-left: -380px; /* Quitamos el margen izquierdo */
margin-bottom: -25px; /* Agregamos un margen inferior para separar el título de los subtítulos */
}

.subtitulos {
height: auto; /* Quitamos la altura fija para que los subtítulos ocupen el espacio necesario */
overflow: visible; /* Eliminamos el ocultamiento de los subtítulos */
text-align: center; /* Centramos los subtítulos horizontalmente */
}

.subtitulo {
font-size: 20px; /* Ajustamos el tamaño de los subtítulos */
position: static; /* Cambiamos la posición a estática para que aparezcan debajo del título */
width: 100%; /* Aseguramos que ocupen el ancho completo del contenedor */
margin: 0px 0;
margin-left: 70px; /* Agregamos margen superior e inferior para separar los subtítulos */
}

.imagenes-container {
max-width: 100%; /* Permitimos que las imágenes ocupen el ancho completo del contenedor */
margin: 20px 0; /* Agregamos margen superior e inferior para separar las imágenes del título y subtítulos */
}

.imagen {
width: 210px; /* Ajustamos el tamaño de las imágenes para que sean más grandes */
height: 210px;
object-fit: contain;
}

  /* Carrusel de noticias */
  .carrusel {
    top: -850px;
    right: 350px;
    width: 35%;
}
}